<template>
  <div>
    <h3 style="text-align: center">采购审核</h3>
    <form style="text-align: right">
        <el-button type="primary" @click="search">查询</el-button>
    </form>
    <el-table
        :data="purchaseOrderAry"
        style="width: 100%">
      <el-table-column
          prop="purchaseId"
          label="采购id"
          width="100">
      </el-table-column>
      <el-table-column
          prop="purchaseOrderNumber"
          label="采购订单编号"
          width="150">
      </el-table-column>
      <el-table-column
          prop="supplierId"
          label="供应商"
          width="100">
      </el-table-column>
      <el-table-column
          prop="totalAmount"
          label="总数量"
          width="150">
      </el-table-column>
      <el-table-column
          prop="totalPrice"
          label="总金额"
          width="150">
      </el-table-column>

      <el-table-column label="操作">
        <template slot-scope="scope">
          <el-button
              size="mini"
              type="success"
              @click="purchaseOrderById(scope.row.purchaseId)"
          >审核</el-button>
        </template>
      </el-table-column>
    </el-table>
<!--    审核面板-->
    <el-dialog
        title="采购订单审核"
        :visible.sync="dialogVisible"
        width="30%">
      <el-form :inline="true" :model="purchaseOrderList" class="demo-form-inline">
        <el-form-item label="采购订单编号">
          <el-input v-model="purchaseOrderList.purchaseOrderNumber" readonly ></el-input>
        </el-form-item>
        <el-form-item label="总数量">
          <el-input v-model="purchaseOrderList.totalAmount" readonly></el-input>
        </el-form-item>
        <el-form-item label="总金额">
          <el-input v-model="purchaseOrderList.totalPrice" readonly ></el-input>
        </el-form-item>
        <el-form-item label="支付方式">
          <el-input v-model="purchaseOrderList.payMethod" readonly ></el-input>
        </el-form-item>
        <el-form-item label="审核人">
          <el-input v-model="purchaseOrderList.checker"></el-input>
        </el-form-item>
        <el-form-item label="审核时间">
          <el-date-picker
              v-model="purchaseOrderList.checkTime"
              type="datetime"
              placeholder="审核日期"
              value-format="yyyy-MM-dd HH:mm:ss">
          </el-date-picker>
        </el-form-item>
        <el-form-item label="审核理由">
          <el-input
              type="textarea"
              :rows="2"
              placeholder="请输入审核理由"
              v-model="purchaseOrderList.checkReason">
          </el-input>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
          <el-button  @click="dialogVisible = false">取消</el-button>
          <el-button type="danger" @click="noPass">审核不通过</el-button>
          <el-button type="success" @click="pass">审核通过</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
export default {
  data(){
    return{
      //查询所有待审核的采购单的数组
      purchaseOrderAry:[],
      //默认审核面板隐藏
      dialogVisible : false,
      //根据id查询待审核采购单
      purchaseOrderList:{}
    }
  },
  methods:{
    //查询所有待审核的采购单
    async search(){
      const {data:res}=
          await this.$http.post(`/community/purchaseOrder/checkList`)
      // console.log(res)
      this.purchaseOrderAry = res
    },
    //根据id查询待审核的采购单
    async purchaseOrderById(purchaseId){
      this.dialogVisible = true
      const {data:res}=
          await this.$http.post(`/community/purchaseOrder/purchaseOrderById?purchaseId=`+purchaseId)
      // console.log(res)
      this.purchaseOrderList = res
    },
    //审核不通过
    async noPass(){
      this.dialogVisible = false
      const {data:res}=
          await this.$http.post(`/community/purchaseOrder/noPass?`,this.purchaseOrderList)
      alert("审核不通过!")
      this.search()
    },
    //审核通过
    async pass(){
      this.dialogVisible = false
      console.log(this.purchaseOrderList)
      const {data:res}=
          await this.$http.post(`/community/purchaseOrder/pass?`,this.purchaseOrderList)
      alert("审核通过!")
      this.search()
    }
  }
}
</script>

<style scoped>

</style>